@use 'src/styles/abstracts' as *;

.BaseGroupingItem {
  margin-right: $space-xxxs;
  border: $border-transparent;

  &__label {
    margin-top: toRem(1px);
  }
  &:last-child {
    margin-right: 0;
  }
  &.active {
    background-color: $primary-color-10;
  }
  &.outlined {
    background-color: $primary-color-10;
    border: $border-main-active;
  }
  &:hover {
    background-color: $pico-5;
  }
  &__arrowIcon {
    margin-left: $space-xxs;
    transition: transform $popover-opening-duration ease-out;
    color: $pico-80;
    &.opened {
      transform: rotateX(180deg);
      color: $primary-color;
    }
  }
}

